<template>
	<u-navbar autoBack  placeholder :title="title">
		<template  slot="right"  v-if="isGroup">
			<!-- <u-icon name="server-fill" color="#000000" size="28"></u-icon> -->
			<image class="margin-left"  :src="chatMore"  @click="management"  />
			
		</template>
	</u-navbar>
</template>
<script setup lang="ts">
import {
  TUIStore,
  StoreName,
  IConversationModel,
  TUITranslateService,
} from "@tencentcloud/chat-uikit-engine";
import { TUIGlobal } from "@tencentcloud/universal-api";
import { onLoad } from "@dcloudio/uni-app";
import { ref } from "../../../adapter-vue";
import chatMore  from "../../../assets/icon/chat-more.png";
const props=defineProps({
	isGroup:{
		type:Boolean,
	}
})
let title=ref('')
const currentConversation = ref<IConversationModel>();
const typingStatus = ref(false);
const emits=defineEmits(['managementGroup'])
const setChatHeaderContent = (content: string) => {
  // TUIGlobal?.setNavigationBarTitle({
  //   title: content || '怀太公商城聊天',
  // });
  title.value=content || '怀太公商城聊天'
};

TUIStore.watch(StoreName.CONV, {
  currentConversation: (conversation: IConversationModel) => {
    currentConversation.value = conversation;
    if(!typingStatus.value){
      setChatHeaderContent(currentConversation?.value?.getShowName());
    }
  },
});

TUIStore.watch(StoreName.CHAT, {
  typingStatus: (status: boolean) => {
    typingStatus.value = status;
    switch (typingStatus.value) {
      case true:
        setChatHeaderContent(TUITranslateService.t("TUIChat.对方正在输入"));
        break;
      case false:
        setChatHeaderContent(currentConversation?.value?.getShowName());
        break;
    }
  },
});
const management=()=>{
	emits('managementGroup')
}
onLoad((options: any) => {
  setChatHeaderContent(currentConversation?.value?.getShowName());
});
</script>
<style lang="scss" scoped>
	.margin-left{
		margin-left:24rpx;
		width: 48rpx;
		height: 18rpx;
	}
</style>
